<template>
  <div class="mycenter">
    <div class="box">
      <el-row>
        <el-col
          :span="4"
          class="nav_box"
        >
          <ul class="nav">
            <li>
              <router-link to="/center/userset">个人信息</router-link>
            </li>
            <li>
              <router-link to="/center/myorder">我的订单</router-link>
            </li>
            <li>
              <router-link to="/center/contact">收货地址</router-link>
            </li>
            <li>
              <router-link to="/center/pay">钱包充值</router-link>
            </li>
            <li>
              <router-link to="/center/favorite">我的收藏</router-link>
            </li>
            <li>
              <router-link to="/center/history">浏览足迹</router-link>
            </li>
          </ul>
        </el-col>
        <el-col
          :span="19"
          class="route_box"
        >
          <router-view></router-view>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
export default {
  name: "mycenter",
};
</script>

<style scoped>
* {
  margin: 0;
  padding: 0;
}
.box {
  width: 80%;
  margin: 40px auto;
}
.nav_box {
  border: 1px solid lightgray;
}
.nav {
  list-style: none;
}
a {
  text-align: center;
  color: black;
}
.route_box {
  border: 1px solid lightgray;
  margin-left: 20px;
}
</style>